import React, { PureComponent } from 'react'

import About from './page/About'
// 高级组件 对组件进行额外操作
function enhancedUserInfo(OriginComponent) {
  class NewComponent extends PureComponent{
    constructor(props) {
      super(props)
      this.state = {
        name: 'coderwhy',
        level: 99
      }
    }
    render() {
      return <OriginComponent {...this.props} {...this.state} />
    }
    
  }
  return NewComponent;
}
const Home = enhancedUserInfo((props) => {
  return(
    <p>home--name:{props.name}</p>
  )
})
const Profile = enhancedUserInfo((props) => { 
  return(
    <div>profile-level {props.level}</div>
  )
})

// function Home(params) {
//   return(
//     <p>home</p>
//   )
// }
// function Profile(params) {
//   return(
//     <div>profile</div>
//   )
// }
export class App extends PureComponent {
  render() {
    return (
      <div>
        <p>App</p>
        <Home />
        <Profile />
        <About age={12} />
      </div>
    )
  }
}

export default App